<template>
  <el-breadcrumb separator="/" class="bread">
    <!-- <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item> -->
    <el-breadcrumb-item v-for="item in navs" :key="item.path" :to="{ path: item.path }" @click="logPath(item.path)">{{
      item.meta.title }}</el-breadcrumb-item>
  </el-breadcrumb>
</template>

<script setup>
import { onMounted,ref,reactive, computed } from 'vue';
import { useRoute, useRouter } from 'vue-router';
const route = useRoute()
const router = useRouter()
// onMounted(() => {
//   console.log(route);
// })
const navs = computed(() => {
  let routes = route.matched
  return routes
})
const logPath = (path) => {
  console.log('点击的路径:', path);
}
</script>

<style lang="less" scoped>
.bread {
  margin-bottom: 10px;
}
</style>